@model EditCustomerViewModel

@{
	ViewBag.Title = Resources.Shared.AppName + " - " + string.Format(Resources.Shared.EditViewTitle, Model.IdentityDescription);
	string twoLettersCulture = new System.Globalization.CultureInfo(Culture).TwoLetterISOLanguageName;	
}

<div class="view-container">
  <div class="view-header-container">
    <h2 class="view-header">@string.Format(Resources.Shared.EditViewTitle, Model.IdentityDescription)</h2>
  </div>
  <!-- Top buttons -->
  <div class="view-button-container top-button-container">
    <input type="button" class="button back-button" title="@Resources.Shared.Back" onclick="document.location = '@Url.Action("Index","Customer")'"/>
    <input type="button" class="button save-button" title="@Resources.Shared.Save" onclick="$('#CustomerForm').submit()"/>	
  </div>
  <!-- Form begin -->
  <div class="entity-form-container">
    @using (Html.BeginForm("Edit", "Customer", FormMethod.Post, new { id = "CustomerForm" })) {
      @Html.ValidationSummary(true)
      <fieldset>
        <legend>@Resources.CustomerResources.Customer</legend>
		<div class="form">
          @Html.HiddenFor(model => model.Id)
				<div class="field">
				  <div class="label">
					@Html.Label(Resources.CustomerResources.FirstName)
			  	  </div>
				  <div class="editor">
					@Html.TextBoxFor(model => model.FirstName)
					@Html.ValidationMessageFor(model => model.FirstName)
				  </div>
				</div>
				<div class="field">
				  <div class="label">
					@Html.Label(Resources.CustomerResources.LastName)
			  	  </div>
				  <div class="editor">
					@Html.TextBoxFor(model => model.LastName)
					@Html.ValidationMessageFor(model => model.LastName)
				  </div>
				</div>
				<div class="field">
				  <div class="label">
					@Html.Label(Resources.CustomerResources.Email)
			  	  </div>
				  <div class="editor">
					@Html.TextBoxFor(model => model.Email)
					@Html.ValidationMessageFor(model => model.Email)
				  </div>
				</div>
				<div class="field">
				  <div class="label">
					@Html.Label(Resources.CustomerResources.IsInactive)
				  </div>
				  <div class="editor">
					@Html.EditorFor(model => model.IsInactive)
					@Html.ValidationMessageFor(model => model.IsInactive)
				  </div>
				</div>
				@Html.HiddenFor(model => model.SessionId)
        </div>
      </fieldset>
    }
    </div>
	<!-- Form end -->
	<!-- Tab strip begin -->
    <div id="CustomerTab-container">
      <ul>
            
        <li>
		  <span class="tab_outer">
            <span class="tab_inner">
			  <a href="#reviewsTab">@Resources.CustomerResources.Reviews</a>
			</span>
          </span>
		</li>
            
        <li>
		  <span class="tab_outer">
            <span class="tab_inner">
			  <a href="#ordersTab">@Resources.CustomerResources.Orders</a>
			</span>
          </span>
		</li>
            
        <li>
		  <span class="tab_outer">
            <span class="tab_inner">
			  <a href="#addressesTab">@Resources.CustomerResources.Addresses</a>
			</span>
          </span>
		</li>
      </ul>
	  <!-- Reviews Tab begin -->
      <div id="reviewsTab">
        <!-- Grid begin -->
        <div class="grid-view-container">
		  <div class="grid-top-buttons">
	        <input type="button" class="button create-button" title="@(Resources.Shared.Add)" onclick="AddOrEditGridDetail('AddReviews', 'ReviewsGrid','@Url.Action("AddReviews", "Customer")?masterId=@Model.Id', 'add');" />
	        <input type="button" class="button report-button" title="@(Resources.Shared.Report)" onclick="document.location = '@Url.Action("ReportReviews", "Customer")?masterId=@Model.Id';" />
	      </div>          
		  <div class="grid-separator">
		  </div>
          <div class="grid-view-panel">
			<table id="ReviewsGrid"></table>
          </div>
		  <div class="grid-separator">
		  </div>
		  <div class="grid-view-count">
            <span>@(Resources.Shared.GridTotal)<span id="ReviewsGrid-total-count" class="count-number"></span></span>    
          </div>
        </div>
        <!-- Grid end -->
        
      </div>
	  <!-- Reviews Tab end -->
	  <!-- Orders Tab begin -->
      <div id="ordersTab">
        <!-- Grid begin -->
        <div class="grid-view-container">
		  <div class="grid-top-buttons">
	        <input type="button" class="button create-button" title="@(Resources.Shared.Add)" onclick="AddOrEditGridDetail('AddOrders', 'OrdersGrid','@Url.Action("AddOrders", "Customer")?masterId=@Model.Id', 'add');" />
	        <input type="button" class="button report-button" title="@(Resources.Shared.Report)" onclick="document.location = '@Url.Action("ReportOrders", "Customer")?masterId=@Model.Id';" />
	      </div>          
		  <div class="grid-separator">
		  </div>
          <div class="grid-view-panel">
			<table id="OrdersGrid"></table>
          </div>
		  <div class="grid-separator">
		  </div>
		  <div class="grid-view-count">
            <span>@(Resources.Shared.GridTotal)<span id="OrdersGrid-total-count" class="count-number"></span></span>    
          </div>
        </div>
        <!-- Grid end -->
        
      </div>
	  <!-- Orders Tab end -->
	  <!-- Addresses Tab begin -->
      <div id="addressesTab">
        <!-- Grid begin -->
        <div class="grid-view-container">
		  <div class="grid-top-buttons">
	        <input type="button" class="button create-button" title="@(Resources.Shared.Add)" onclick="AddOrEditGridDetail('AddAddresses', 'AddressesGrid','@Url.Action("AddAddresses", "Customer")?masterId=@Model.Id', 'add');" />
	        <input type="button" class="button report-button" title="@(Resources.Shared.Report)" onclick="document.location = '@Url.Action("ReportAddresses", "Customer")?masterId=@Model.Id';" />
	      </div>          
		  <div class="grid-separator">
		  </div>
          <div class="grid-view-panel">
			<table id="AddressesGrid"></table>
          </div>
		  <div class="grid-separator">
		  </div>
		  <div class="grid-view-count">
            <span>@(Resources.Shared.GridTotal)<span id="AddressesGrid-total-count" class="count-number"></span></span>    
          </div>
        </div>
        <!-- Grid end -->
        
      </div>
	  <!-- Addresses Tab end -->
    </div>
    <!-- Tab strip end -->
 
</div>
@section Scripts {
	@Scripts.Render("~/bundles/jqueryval")
	<script src="@Url.Content("~/Scripts/cultures/methods_" + twoLettersCulture + ".js")" type="text/javascript"></script>
<script type="text/javascript">

$("#CustomerTab-container" ).tabs({
	show: function (event, ui) {
			if(ui.panel.id == "reviewsTab")
			{
				$("#ReviewsGrid").jqGrid({
					url: '@Url.Action("LoadReviews", "Customer")?masterId=@Model.Id',
					datatype: 'json',
					mtype: 'POST',
					autowidth: true,
					altRows: true,
					altclass: 'grid-alt-row',
					rowNum: -1,
					colNames: ['Date', 'Rating', 'Comment', 'Product', '', ''],
					colModel: [
					{ index: 'Date', name: 'Date', sortable: false, resizable: false},
					{ index: 'Rating', name: 'Rating', sortable: false, resizable: false},
					{ index: 'Comment', name: 'Comment', sortable: false, resizable: false},
					{ index: 'Product', name: 'Product', sortable: false, resizable: false},
						{ name: 'edit', sortable: false, classes: 'grid-cell-edit', resizable: false },
						{ name: 'delete', sortable: false, classes: 'grid-cell-delete', resizable: false },
					],
					gridComplete: 
						function(){ 
							var ids = jQuery("#ReviewsGrid").jqGrid('getDataIDs'); 
							for(var i=0;i < ids.length;i++)
							{ 
								var rowId = ids[i]; 
								var editHtml = '<a href="#" onclick="AddOrEditGridDetail(\'EditReviews\', \'ReviewsGrid\',\'@Url.Action("EditReviews", "Customer")/' + rowId  + '?masterId=@Model.Id\', \'edit\')" title="@Resources.Shared.Edit"><img src="@Url.Content("~/Content/Images/CRUD/edit.png")"/></a>';
								var deleteHtml = '<a href="#" onclick="return DeleteGridItem(\'ReviewsGrid\', \'@Url.Action("DeleteReviews", "Customer")\', \'' + rowId + '\', \'@Model.Id\')" title="@Resources.Shared.Delete"><img src="@Url.Content("~/Content/Images/CRUD/delete.png")"/></a>';
								$("#ReviewsGrid").jqGrid('setRowData', ids[i], { edit: editHtml, delete: deleteHtml }); 
							}
							
							$("#ReviewsGrid").jqGrid('setLabel', 'Date', '@Resources.ReviewResources.Date', 'grid-header-data', '');
							$("#ReviewsGrid").jqGrid('setLabel', 'Rating', '@Resources.ReviewResources.Rating', 'grid-header-data', '');
							$("#ReviewsGrid").jqGrid('setLabel', 'Comment', '@Resources.ReviewResources.Comment', 'grid-header-data', '');
							$("#ReviewsGrid").jqGrid('setLabel', 'Product', '@Resources.ReviewResources.Product', 'grid-header-data', '');
							$("#ReviewsGrid").jqGrid('setLabel', 'edit', '', 'grid-header-edit', '');							
							$("#ReviewsGrid").jqGrid('setLabel', 'delete', '', 'grid-header-delete', '');
							
							// Fix: jqgrid first row causes problems with fixed cols
							FixGridColumnSize({ gridId: "ReviewsGrid", hasEdit: true, hasDelete: true });
						},
					loadComplete:
						function(data){ 
							SetGridTotalCount("ReviewsGrid", data.records);
						}
				});
			}
			if(ui.panel.id == "ordersTab")
			{
				$("#OrdersGrid").jqGrid({
					url: '@Url.Action("LoadOrders", "Customer")?masterId=@Model.Id',
					datatype: 'json',
					mtype: 'POST',
					autowidth: true,
					altRows: true,
					altclass: 'grid-alt-row',
					rowNum: -1,
					colNames: ['Reference', 'Date', 'ShippingCost', 'OrderState', '', ''],
					colModel: [
					{ index: 'Reference', name: 'Reference', sortable: false, resizable: false},
					{ index: 'Date', name: 'Date', sortable: false, resizable: false},
					{ index: 'ShippingCost', name: 'ShippingCost', sortable: false, resizable: false},
					{ index: 'OrderState', name: 'OrderState', sortable: false, resizable: false},
						{ name: 'edit', sortable: false, classes: 'grid-cell-edit', resizable: false },
						{ name: 'delete', sortable: false, classes: 'grid-cell-delete', resizable: false },
					],
					gridComplete: 
						function(){ 
							var ids = jQuery("#OrdersGrid").jqGrid('getDataIDs'); 
							for(var i=0;i < ids.length;i++)
							{ 
								var rowId = ids[i]; 
								var editHtml = '<a href="#" onclick="AddOrEditGridDetail(\'EditOrders\', \'OrdersGrid\',\'@Url.Action("EditOrders", "Customer")/' + rowId  + '?masterId=@Model.Id\', \'edit\')" title="@Resources.Shared.Edit"><img src="@Url.Content("~/Content/Images/CRUD/edit.png")"/></a>';
								var deleteHtml = '<a href="#" onclick="return DeleteGridItem(\'OrdersGrid\', \'@Url.Action("DeleteOrders", "Customer")\', \'' + rowId + '\', \'@Model.Id\')" title="@Resources.Shared.Delete"><img src="@Url.Content("~/Content/Images/CRUD/delete.png")"/></a>';
								$("#OrdersGrid").jqGrid('setRowData', ids[i], { edit: editHtml, delete: deleteHtml }); 
							}
							
							$("#OrdersGrid").jqGrid('setLabel', 'Reference', '@Resources.OrderResources.Reference', 'grid-header-data', '');
							$("#OrdersGrid").jqGrid('setLabel', 'Date', '@Resources.OrderResources.Date', 'grid-header-data', '');
							$("#OrdersGrid").jqGrid('setLabel', 'ShippingCost', '@Resources.OrderResources.ShippingCost', 'grid-header-data', '');
							$("#OrdersGrid").jqGrid('setLabel', 'OrderState', '@Resources.OrderResources.OrderState', 'grid-header-data', '');
							$("#OrdersGrid").jqGrid('setLabel', 'edit', '', 'grid-header-edit', '');							
							$("#OrdersGrid").jqGrid('setLabel', 'delete', '', 'grid-header-delete', '');
							
							// Fix: jqgrid first row causes problems with fixed cols
							FixGridColumnSize({ gridId: "OrdersGrid", hasEdit: true, hasDelete: true });
						},
					loadComplete:
						function(data){ 
							SetGridTotalCount("OrdersGrid", data.records);
						}
				});
			}
			if(ui.panel.id == "addressesTab")
			{
				$("#AddressesGrid").jqGrid({
					url: '@Url.Action("LoadAddresses", "Customer")?masterId=@Model.Id',
					datatype: 'json',
					mtype: 'POST',
					autowidth: true,
					altRows: true,
					altclass: 'grid-alt-row',
					rowNum: -1,
					colNames: ['AddressLine1', 'AddressLine2', 'City', 'StateProvince', 'PostalCode', 'Country', 'IsBilling', '', ''],
					colModel: [
					{ index: 'AddressLine1', name: 'AddressLine1', sortable: false, resizable: false},
					{ index: 'AddressLine2', name: 'AddressLine2', sortable: false, resizable: false},
					{ index: 'City', name: 'City', sortable: false, resizable: false},
					{ index: 'StateProvince', name: 'StateProvince', sortable: false, resizable: false},
					{ index: 'PostalCode', name: 'PostalCode', sortable: false, resizable: false},
					{ index: 'Country', name: 'Country', sortable: false, resizable: false},
					{ index: 'IsBilling', name: 'IsBilling', sortable: false, resizable: false},
						{ name: 'edit', sortable: false, classes: 'grid-cell-edit', resizable: false },
						{ name: 'delete', sortable: false, classes: 'grid-cell-delete', resizable: false },
					],
					gridComplete: 
						function(){ 
							var ids = jQuery("#AddressesGrid").jqGrid('getDataIDs'); 
							for(var i=0;i < ids.length;i++)
							{ 
								var rowId = ids[i]; 
			var isBillingHtml = FormatGridBooleanProperty({name: 'IsBilling', gridID: 'AddressesGrid', rowID: rowId, trueImg: '@Url.Content("~/Content/Images/yes.gif")' });
								var editHtml = '<a href="#" onclick="AddOrEditGridDetail(\'EditAddresses\', \'AddressesGrid\',\'@Url.Action("EditAddresses", "Customer")/' + rowId  + '?masterId=@Model.Id\', \'edit\')" title="@Resources.Shared.Edit"><img src="@Url.Content("~/Content/Images/CRUD/edit.png")"/></a>';
								var deleteHtml = '<a href="#" onclick="return DeleteGridItem(\'AddressesGrid\', \'@Url.Action("DeleteAddresses", "Customer")\', \'' + rowId + '\', \'@Model.Id\')" title="@Resources.Shared.Delete"><img src="@Url.Content("~/Content/Images/CRUD/delete.png")"/></a>';
								$("#AddressesGrid").jqGrid('setRowData', ids[i], { IsBilling: isBillingHtml, edit: editHtml, delete: deleteHtml }); 
							}
							
							$("#AddressesGrid").jqGrid('setLabel', 'AddressLine1', '@Resources.AddressResources.AddressLine1', 'grid-header-data', '');
							$("#AddressesGrid").jqGrid('setLabel', 'AddressLine2', '@Resources.AddressResources.AddressLine2', 'grid-header-data', '');
							$("#AddressesGrid").jqGrid('setLabel', 'City', '@Resources.AddressResources.City', 'grid-header-data', '');
							$("#AddressesGrid").jqGrid('setLabel', 'StateProvince', '@Resources.AddressResources.StateProvince', 'grid-header-data', '');
							$("#AddressesGrid").jqGrid('setLabel', 'PostalCode', '@Resources.AddressResources.PostalCode', 'grid-header-data', '');
							$("#AddressesGrid").jqGrid('setLabel', 'Country', '@Resources.AddressResources.Country', 'grid-header-data', '');
							$("#AddressesGrid").jqGrid('setLabel', 'IsBilling', '@Resources.AddressResources.IsBilling', 'grid-header-data', '');
							$("#AddressesGrid").jqGrid('setLabel', 'edit', '', 'grid-header-edit', '');							
							$("#AddressesGrid").jqGrid('setLabel', 'delete', '', 'grid-header-delete', '');
							
							// Fix: jqgrid first row causes problems with fixed cols
							FixGridColumnSize({ gridId: "AddressesGrid", hasEdit: true, hasDelete: true });
						},
					loadComplete:
						function(data){ 
							SetGridTotalCount("AddressesGrid", data.records);
						}
				});
			}
	}
});
</script>
}
